<template>
  <!-- 施工单位管理详情 -->
  <div>
    <div class="bread-box but20">
      <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item class="btn-green" style=" color: #3DC094;" @click.native="handleBack">施工单位管理</el-breadcrumb-item>
        <el-breadcrumb-item>详情</el-breadcrumb-item>
      </el-breadcrumb>
      <div class="top-btn-group">
        <!-- <el-button type="primary" size="mini" @click="handleSave">保存</el-button> -->
        <el-button size="mini" @click="handleBack">返回</el-button>
      </div>
    </div>
    <div>
      <el-form ref="refForm" class="financeForm" :rules="formRules" :model="formData" size="mini" label-width="170px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="施工单位编码:" size="mini" prop="unitCode">
              <span>{{ formData.unitCode }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="施工单位名称:" prop="unitName">
              <span>{{ formData.unitName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="签约时间:" prop="time">
              <span>{{ formData.signUpTime }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="负责人:" size="mini" prop="unitPerson">
              <span>{{ formData.principal }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="负责人电话:" size="mini" prop="unitPhone">
              <span>{{ formData.principalPhone }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="QQ:" size="mini" prop="transferAmount">
              <span>{{ formData.unitQq }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label="地址:" size="mini" prop="address">
              <span>{{ formData.address }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="邮编:" size="mini" prop="postcode">
              <span>{{ formData.postcode }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="同一时间最大承接面积:" size="mini" prop="sameTimeMaxArea">
              <span>{{ formData.sameTimeMaxArea }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="同一时间最大承接项目数量:" size="mini" prop="sameTimeMaxProject">
              <span>{{ formData.sameTimeMaxProject }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="质保金最低限额:" size="mini" prop="warrantyMinNorm">
              <span>{{ formData.warrantyMinNorm }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="合作状态:" size="mini" prop="cooperationState">
              <span>{{ formaterData(cooperationStateList, formData.cooperationState) }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="合作终止类型:" size="mini" prop="cooperateEndType">
              <span>{{ formaterData(cooperateEndTypeList, formData.cooperateEndType) }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="当前保证金余额（元）:" size="mini" prop="currentWarrantyNumber">
              <span>{{ formData.currentWarrantyNumber }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="备注:" size="mini" prop="remark">
              <span>{{ formData.remark }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="日常评估总分值:" size="mini" prop="dailyTotalScore">
              <span>{{ formData.dailyTotalScore }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="项目过程评分:" size="mini" prop="processAvgScore">
              <span>{{ formData.processAvgScore }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="项目验收评分:" size="mini" prop="assessAvgScore">
              <span>{{ formData.assessAvgScore }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="评估总分值:" size="mini" prop="assessSumScore">
              <span>{{ formData.assessSumScore }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="创建人:" size="mini" prop="createBy">
              <span>{{ formData.createBy }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="创建时间:" size="mini" prop="createTime">
              <span>{{ formData.createTime }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="修改人:" size="mini" prop="lastUpdateBy">
              <span>{{ formData.lastUpdateBy }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="修改时间:" size="mini" prop="lastUpdateTime">
              <span>{{ formData.lastUpdateTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div style="margin-bottom: 50px">
      <c-permission-tabs @tab-click="handleClick">
        <el-tab-pane label="保证金管理" name="marginManagement">
          <margin-management ref="marginManagement" :detail-data="activatedData" />
        </el-tab-pane>
        <el-tab-pane label="评分管理" name="dailyAssessment">
          <daily-assessment ref="dailyAssessment" :detail-data="activatedData" />
        </el-tab-pane>
        <el-tab-pane label="施工项目记录" name="constructionRecord">
          <construction-record ref="constructionRecord" :detail-data="activatedData" />
        </el-tab-pane>
        <el-tab-pane label="附件信息" name="unitAccessory">
          <Accessory ref="unitAccessory" type="unitAccessory" :detail-data="activatedFileData" />
        </el-tab-pane>
      </c-permission-tabs>
    </div>
  </div>
</template>

<script>
import ConstructionRecord from './component/constructionRecord.vue'
import DailyAssessment from './component/dailyAssessment.vue'
import MarginManagement from './component/marginManagement.vue'
import { quertDeatilData } from '@/api/constructionUnitMng'
import { getDictByPatchType } from '@/api/dataDict'
import Accessory from '../../productConfig/decoration/components/accessory.vue'
import { postConfigAttachmentTemplate } from '@/api/proConfig'
// import { getShopAttachment } from '@/api/decorate'
export default {
  name: 'DetailUnitMng',
  components: { MarginManagement, DailyAssessment, ConstructionRecord, Accessory },
  props: {
    visible: {
      type: Boolean,
      default: false,
      required: true
    },
    detailData: {
      type: [String, Object],
      default: ''
    }
  },
  data() {
    return {
      activatedData: {},
      activatedFileData: [],
      activeName: 'marginManagement',
      formData: {},
      cooperationStateList: [],
      cooperateEndTypeList: [],
      fileTypeList: []
    }
  },
  computed: {
    dialogShow: {
      get() {
        return this.visible
      },
      set(val) {
        this.$emit('update:visible', val)
      }
    }
  },
  async created() {
    this.activatedData.flag = 'detail'
    this.formData.id = this.detailData.data.id
    this.activatedData.data = this.detailData.data
    await quertDeatilData(this.formData.id).then(res => {
      if (res.success) {
        this.formData = res.data
      }
    })
    await this.getDictByPatchTypeAll(['COOPERATION_STATE', 'COOPERATE_END_TYPE']).then(res => {
      this.cooperationStateList = res.COOPERATION_STATE
      this.cooperateEndTypeList = res.COOPERATE_END_TYPE
    })
    await postConfigAttachmentTemplate('CONST_UNIT').then(res => {
      if (res.success === 1) {
        // 根据modelId获取每个配置id
        if (res.data && res.data.records) {
          this.fileTypeList = res.data.records.filter(item => item.attachmentType === '施工单位管理')
          this.fileTypeList.forEach(row => {
            this.$set(row, 'fileList', [])
          })
          this.modelIds = this.fileTypeList.map(item => item.id)
          this.activatedFileData = this.formData.id
          // this.activatedFileData = this.modelIds[0]
        }
      }
    })
    // getShopAttachment(this.modelIds[0]).then(res => {
    //   this.fileTypeList.forEach(row => {
    //     row.fileList = res.data.filter(i => i.configAttachmentId === row.id)
    //   })
    //   const fileList = this.fileTypeList.map(item => item.fileList)
    //   this.activatedFileData.data = fileList.flat(Infinity)
    // })
  },
  activated() {},
  methods: {
    // 获取数据字典
    async getDictByPatchTypeAll(data) {
      const obj = await getDictByPatchType(data)
        .then(res => {
          return res
        })
      return obj
    },
    // 格式化数据
    formaterData(arr, dictCode) {
      const tmpArr = arr.filter(item => item.dictCode === dictCode)
      if (tmpArr.length) {
        return tmpArr[0].dictName
      }
      return dictCode
    },
    handleBack() {
      this.$emit('goBack')
    }
  }
}
</script>

<style lang="scss" scoped>
/deep/ .el-breadcrumb__inner{
    color: $qup-color-primary;
  }
.but20{ margin-bottom: 20px;}
.el-breadcrumb__inner,.btn-green{
    color: #3DC094;
}
</style>
